<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /*
           一个人  继承 另一个人的 东西--财产--技能 （属性(有的东西)-方法（会的技能））


           封装-》 构造函数--类 ------》面向过程--函数



           一个类（子类） 继承 另一个类（父类）--》  子类就用拥有 父类的 里面的 属性和方法
           继承好处：复用另一个类的代码


           js中继承有哪些---构造函数继承-原型链继承-混合继承-es6 类-extends--继承
           es5实现继承有哪些方式---构造函数继承-原型链继承-混合继承

           1-构造函数继承
               核心--子类调用 父类的构造函数，并且改变其中的this
               缺点：只能继承构造函数内部的属性，不能继承原型的方法

           2-原型链继承
               强制改变 构造函数（类）的原型，让他指向一个对象，优点：能继承原型上方法
                   缺点：继承属性没有太大意义

           3-混合继承（寄生继承）
                核心--子类调用 父类的构造函数，并且改变其中的this--继承父类的属性
               强制改变 构造函数（类）的原型，让他指向一个对象，优点：能继承原型上方法



           4-es6 类--继承  
               class 子类 extends 父类 
                  如果要实现子类的constructor构造函数，那么必须在子类的constructor中调用 super（父类的构造函数），否则会报错

                  也可以在子类 重写 父类的 方法， 如果子类中仍然想要使用 父类的方法-可以使用super关键字 super.run()
               es6继承 可以看成 es5混合继承的语法糖（）
       */

        class Animal {
            age = 0
            constructor(name) {
                this.name = name;
            }

            run() {
                console.log('父类的run');
                console.log(this.name + '：跑');
            }
        }

        class Dog extends Animal {
            // 如果要实现子类的构造函数，那么必须在子类中调用 super（父类的构造函数）
            constructor(name, color) {
                super(name);

                // 在构造函数中给 类 添加属性
                this.color = color;
            }
            test() {
                console.log('test');
            }

            // 重写 父类的方法--完全覆盖 原来的 run
            // run() {
            //     console.log('子类的run');
            // }


            run() {

                // 
                console.log('子类的run');

                // 调用了父类的run
                super.run();

            }

        }

        let d1 = new Dog('小黑', 'red')
        console.log(d1);

        d1.test()

        // 使用了run 
        d1.run()
    </script>

</body>

</html>